/* Custom javascript 详细介绍请查看官方文档
 * @param {Object} params
 * @property {Array} params.axes  chart options中的轴配置，与拖入的轴对应
 * @property {Object} params.data  接口返回的数据，与轴对应
 * @property {Array} params.data.data 接口返回的原始数据
 * @property {Array} params.data.schema 这里包含了初步加工过的数据，其中的dataUniq是去重并按照配置排好序的
 * @property {number} params.width  容器的宽度
 * @property {number} params.height 容器的高度
 * @property {Function} params.getD3 获取d3工具库, 当前版本7.0.1
 * @property {Function} params.getEcharts 获取echarts，当前版本是4.9，用于写扩展
 * @property {Function} params.useEchartsGL 加载echartsGL, 1.1.2版本
 * @property {Function} params.getThree 获取three.js，当前版本0.132.2
 * @property {Function} params.getTween 获取tween.js，当前版本18.6.4
 * @property {Function} params.createElement 生成一个DOM
 * @property {Function} params.appendChild 向容器添加DOM
 * @property {Function} params.getParentDOM 获取DOM的父元素
 * @property {Function} params.setInnerHTML 设置容器的innerHTML
 * @property {Function} params.bindClickListener 绑定页面点击事件
 * @property {Function} params.onHSClickHandler 触发衡石交互
 * @property {Function} params.getContext 获取canvas的context
 * @property {Object=} params.currentHighlight 当前高亮项
 * @property {Function} params.bindUnmountHandler 绑定卸载时执行的方法，比如卸载组件，清除setTimeout等
 * @property {Array<clickEventData>=} params.currentHighlight.clickEventData 当前高亮项对应的数据
 */
console.log(params, 'params-==----');

var axes = params.axes;
if (!axes || axes.length !== 2 || axes[0].axisName !== 'group' || axes[1].axisName !== 'metric'
  || axes[1].args.length !==2 ) {
  // 如果不是一个维度一个度量，提示
  params.setInnerHTML('<div style="text-align:center;line-height:' + params.height + 'px;">'
  +    '<span>字段错误</span>'
  +  '</div>'
  );
  return;
}
var colors = ['rgba(57, 131, 253,1)','rgba(65, 202, 250,1)','rgba(255, 179, 1,1)','rgba(107, 221, 136,1)', 'rgba(140, 221, 255,1)','rgba(255, 203, 48,1)','rgba(248, 90, 103,1)','rgba(171, 112, 237,1)','rgba(2, 134, 149,1)','rgba(253, 148, 195,1)']

let myChart = params.getEchartsItem();
var legendData = params.data.schema[0].dataUniq;
var radarData = params.data.schema[1].children[1].dataUniq.map(item => {
	return { name: item, max: 0 }
});
var max = params.data.schema[1].max;
var seriesData = params.data.data;

var series0Data = seriesData.map((item, index) => {
  var colorS = colors[index%colors.length]
  colorS = colorS.slice(0,colorS.length - 2)
  return {
    value: params.data.schema[1].children[1].dataUniq.map((rad, rIndex) => {
      var rValue = item[1].find(itemVal => itemVal[1] === rad);
      var res = 0;
      if(rValue){
        res = rValue[0]
      }
      if(!radarData[rIndex]._ybvalue){
      	radarData[rIndex]._ybvalue = []
      }
      radarData[rIndex]._ybvalue.push(res)
      return res
    }),
    name: item[0],
    areaStyle: {
      color: {
        type: 'radial', //线性渐变
        x: 0.5,
        y: 0.5,
        r: 1,
        colorStops: [
          { offset: 0, color: `${colorS}0)` },
          { offset: 0.5, color: `${colorS}0.4)` },
          { offset: 1, color: `${colorS}1)` }
        ]
      }
    }
  }
})

console.log(radarData, 'radarData')

var option = {
  color: colors,
  legend: {
    data: legendData,
    type: 'scroll',
    bottom: '2%'
  },
  tooltip: {
    show: true
  },
  radar: {
    splitArea: {
        show: false,
      },
    name: {
        textStyle: {
          color: '#6E6E6E',
        },
      },
    // shape: 'circle',
    indicator: radarData.map(item => {
    	return {
        name: item.name, max: Math.max(1, Math.max.apply(null,item._ybvalue)) + 1
      }
    })
  },
  series: [
    {
      name: '各疾病治愈效果分析',
      type: 'radar',
      data: series0Data
    }
  ]
}
console.log(option, 'option')
myChart.setOption(option);

/**
 * @typedef {Object} clickOptions
 * @property {string} className  点击事件的当前元素的className
 * @property {string} id 点击事件的当前元素的id
 * @property {number} x 当前鼠标在容器中的横向相对位置
 * @property {number} y 当前鼠标在容器中的纵向相对位置
 * @property {string} data 当前元素的data属性
 */

/**
 * @type {Function} params.bindClickListener 绑定页面点击事件
 * @param {Function} clickHandler 点击页面的处理函数，接收一个参数clickOptions
 */

/**
 * @typedef ClickEventData
 * @param {string} data 维度值
 * @param {string | number} path 维度值对应的轴位置，例：0（第一个轴）； '1.1' (第二个轴的第二个子轴)
 */

/**
 * @type {Function} params.onHSClickHandler 触发衡石交互
 * @param {Array<clickEventData>} clickData 需要传递的数据
 */
